<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01-jQuery的简单语法</title>
    <script src="../js/jquery-3.6.0.js"></script>
    <script>
        // DOM原生写法
        /*window.onload=function () {
            document.getElementById("btn").onclick=function () {
                let value = document.getElementById("username").value;
                alert(value);
            }
        }*/

        // jQuery 标准写法
        /*$(document).ready(function () {
            $("input").eq(1).click(function () {
                alert("您输入的内容:"+$("input[name=username]").val());
            });
        });*/

        // jQuery 的简化写法
        $(function () {
            $("#btn").click(function () {
                alert("内容："+$("#username").val());
            });
        });
    </script>
</head>
<body>
<form action="#">
    用户名：<input type="text" name="username" id="username" placeholder="请输入用户名"><br>
    <input type="button" id="btn" value="提交">
</form>
</body>
</html>